<template>
  <div class="main">
    <div class="top">
      <div class="dot"></div>
      <div class="title">下载团单表格（填写并上传导入）</div>
    </div>

    <div class="main-bottom">
      <!-- <div class="part">
        <div class="top">
          用&nbsp;<span class="red">成衣尺寸</span>&nbsp;下团单：
        </div>
        <div class="bottom">
          <div class="step">
            <span class="step-text">第1步</span>
            <div class="btn thumb" @click="download">下载团单模板V1. 4<img :src="publicUrl(`/images/upload-icon.png`)" /></div>
          </div>
          <div class="step">
            <span class="step-text">第2步</span>
            <div class="btn thumb" @click="upload">上传团单模板<img  class="transform" :src="publicUrl(`/images/upload-icon.png`)" /></div>
          </div>
        </div>
      </div> -->
      <div class="part">
        <div class="top">
          用&nbsp;<span class="red">团单模板</span>&nbsp;下团单：
        </div>
        <div class="bottom">
          <div class="step">
            <span class="step-text">第1步</span>
            <div class="btn thumb" @click="download">下载团单模板V1. 4<img :src="publicUrl(`/images/upload-icon.png`)" /></div>
          </div>
          <div class="step">
            <span class="step-text">第2步</span>
            <div class="btn thumb" @click="upload">上传团单模板<img class="transform" :src="publicUrl(`/images/upload-icon.png`)" /></div>
          </div>
        </div>
      </div>
    </div>
    <div class="buttons">
        <div class="left btn thumb" @click="()=>stepChange(2)">上一步</div>
        <div class="right btn thumb"  @click="()=>stepChange(4)">加入购物车</div>
    </div>
  </div>
</template>
<script setup lang="ts" name="">
import { publicUrl,aDownLoad } from "@/utils/util";
import { ref } from "vue";
import getFile from "@/utils/getFile"
import { toast } from "vue3-toastify";
const data = ref();
const upload = ()=>{
    getFile('excel',200,{
        errorResult:(str:string)=>toast.error(str),
        successResult:(file:File)=>console.log(file),
    })
}

const download = ()=>{
    aDownLoad(publicUrl(`/53041671002693847.xlsx`),'团单模板');
}
const emits = defineEmits<{
  (event:'stepChange',step:number):void
}>();
const stepChange = (step:number)=>{
    emits("stepChange",step);
}

</script>
<style scoped lang="scss">
@media screen and (min-width: $pc-min-width) {
  @import "./pc.scss";
}
</style>
